﻿@import "Common.less";

.exceptions-spark {
    float: right;
    margin-top: -4px;
}
.exceptions-dashboard
{
    width: 100%;
    margin: 0 auto;
    border-collapse: separate;
    font-family: Verdana, Arial,'Helvetica Neue', Helvetica, sans-serif;

    .exception-search-form
    {
        float: right;
        margin-top: -8px;

        .search-box
        {
            position: relative;
            top: 6px;
            .inset-shadow(0, 3px, 8px, rgba(0,0,0,.2));

            .search-input
            {
                width: 200px;
                color: #666;
                margin: 0;
                padding: 4px 20px 2px 4px;
                border: none;
                background: transparent;
            }

            .search-submit
            {
                position: absolute;
                background: transparent url('img/search-icon.png') no-repeat center center;
                border: none;
                height: 22px;
                width: 16px;
                margin-right: 4px;
                cursor: pointer;
                right: 0;
            }
        }
    }

    .header
    {
        cursor: pointer;
    }

    tr.sort-row th a {
        text-align: left;
    }

    th
    {
        font-weight: bold;
        padding: 2px 1px 0 1px;

        div
        {
            font-weight: bold;
            cursor: pointer;
        }
    }

    /*table-layout: fixed;
    th:nth-child(1), td:nth-child(1) {
        width: 36px;
    }
    th:nth-child(2), td:nth-child(2) {
        width: 112px;
    }
    th:nth-child(3), td:nth-child(3) {
        width: 115px;
    }
    th:nth-child(4), td:nth-child(4) {
    }
    th:nth-child(5), td:nth-child(5) {
        width: 150px;
    }
    th:nth-child(6), td:nth-child(6) {
        width: 96px;
    }
    th:nth-child(7), td:nth-child(7) {
        width: 200px;
    }
    th:nth-child(8), td:nth-child(8) {
        width: 74px;
    }
    th:nth-child(9), td:nth-child(9) {
        width: 40px;
    }*/

    tbody
    {
        td
        {
            padding: 4px 2px;
            font-size: 11px;
            white-space: nowrap;
            border-top: solid 1px transparent;
            border-bottom: solid 1px transparent;

            &.exception-type
            {
                font-weight: bold;
                color: #444;
            }

            &.text-cell
            {
                white-space: normal;
                -ms-text-overflow: ellipsis;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
            }
            .overflow-cap-150 {
                max-width: 150px;
                overflow: hidden;
                -ms-text-overflow: ellipsis;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
            }
            .overflow-cap-200 {
                max-width: 200px;
                overflow: hidden;
                -ms-text-overflow: ellipsis;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
            }
            .overflow-cap-500 {
                max-width: 500px;
                overflow: hidden;
                -ms-text-overflow: ellipsis;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
            }
        }

        tr:hover td
        {
            -webkit-transition: border 200ms ease;
            -moz-transition: border 200ms ease;
            -o-transition: border 200ms ease;
            transition: border 200ms ease;
            border-top: solid 1px #9AB1DC;
            border-bottom: solid 1px #9AB1DC;
        }

        > tr:nth-child(odd) > td
        {
            background-color: #f2f2f2;
        }

        tr.error td:nth-child(2), tr.error td:nth-child(3) {
            -moz-user-select: none;
            -ms-user-select: none;
            -webkit-user-select: none;
            user-select: none;
        }

        tr.error.selected td
        {
            background-color: #ffffcc;
        }
    }

    .actions
    {
        width: 44px;
       
        .delete-link { background: url(img/x.png); }
        .protect-link { background: url(img/lock-off.png); }
        .protected { background: url(img/lock-on.png); }

        a, span
        {
            color: @red;
            text-decoration: none;
            display: inline-block;
            text-indent: -9999em;
            font-size: 1px;
            height: 16px;
            width: 16px;
            vertical-align: middle;
        }
    }

    .error.deleted
    {
        .delete-link
        {
            opacity: 0.2;
            cursor: default;
        }
    }

    .exception-cell
    {
        position: relative;
    }

    .exception-link
    {
        color: @blue-link;
        white-space: normal;
        text-decoration: none;

        &.bad-error
        {
            color: #AA0000;
            font-weight: bold;
        }

        &.hidden-exception
        {
            display: none;
        }
    }
}
.top-link {
    color: #DDD;
}
.top-delete-link {
    float: right;
}
.error-bread-top {
    a { 
        color: @blue-link; 
        text-decoration: none;

        &:hover {
            text-decoration: underline;
        }
    }
    .error-title {
        font-weight: bold; 
        color: @red; 
    }
    .clear-all-link, .clear-visible-link {
        color: @red;
    }
}
h3 .clear-all-link, h3 .clear-visible-link {
    float: right;
    font-size: 12px;
}
.clear-all-link, .clear-visible-link {
    color: @red;
    text-decoration: none;   

    &:hover { 
        text-decoration: underline;
    }
    &.loading {
        display: inline-block;
        width: 24px;
    }
}
.clear-all-div { 
    margin-top: 8px; 
    .clear-all-link, .clear-visible-link { 
        padding: 4px; 
        margin-right:2px;
    }
}
#ErrorInfo, .error-preview {    
    color: #232323;

    .error-info, .error-not-found {
        padding: 5px 5px 5px 5px;
    }
    .error-not-found {
        padding-top: 10px;
    }

    .error-header {
        color: #ddd;
    }
    a { 
        color: @blue-link; 
        text-decoration: none;

        &:hover {
            text-decoration: underline;
        }
    }
    table { 
        width: 100%; 
        border-collapse: collapse; 
    }
    td { 
        padding: 0.4em; 
        vertical-align: top; 
    }
    th { 
        text-align: left; 
        padding: 0.4em; 
        color: #555555; 
        vertical-align: top; 
    }
    pre { font-family: Consolas, Monaco, monospace; }

    .error-type, .error-message { display: block; }
    .error-type { 
        color: #444; 
        font-weight: bold;
        padding: 0 0.3em;
    }
    .error-detail {
        background-color: #ffffcc;
        padding: .5em 1em;
        margin: 0.4em 0 1em 0;
        overflow: scroll;
        font: Consolas, monospace;
    }
    .error-title {
        font-weight: bold; 
        color: @red; 
    }
    .sql-detail { 
        background-color: #eee; 
        padding: 8px; 
    }
    .custom-error-label { 
        color: @red; 
        font-weight: bold; 
        padding-left: 4px; 
    }
    .custom-data {
        .error-detail {
            padding: 0.5em;
            margin-top: 4px;
        }
        .kv-table .value {
            white-space: pre;
        }
    } 
    .info-delete-link { 
        color: #ddd; 

        .info-link.loading {
            display: inline-block;
            width: 24px;
        }
    }

    .error-time { 
        font-size: 110%; 
        color: #555; 

        .similar-link {
            color: #ddd;
            float: right;

            .clear-all-link {
                color: @red;
            }
        }
    }

    .side-scroll { width: 100%; overflow: auto; }
    .kv-title {	
        color: #224C00; 
        font-weight: bold; 
        font-size: 120%; 
        margin: 10px 0 5px 0; 
        border-collapse: collapse; 
        border: 0; 

        &.title-error { color: @red; }
        .hidden { display: none; }
    }
    .kv-table {
        td, th { padding : 0.4em; }
        td.key { 
            width:200px; 
            font-size: 0.9em; 
        }
        td.value { 
            font-family: Consolas, Monaco, monospace; 
            font-weight: normal;
        }
        tr:nth-child(odd) { background-color: #F2F2F2; }
    }
}
.error-preview-popup {
    position: absolute;
    left: 10px;
    z-index: 1;
    display: none;
    max-width: 1100px;
    border: solid 1px @blue-link;
    padding: 3px;
    margin: 3px;
    background: white;
	.rounded-corners(5px);
    .box-shadow(4px, 4px, 4px, #CCC);
    font-size: 12px;
}
.error-preview {
    .error-info {
        padding: 2px;
    }
    .error-detail {
        max-height: 52px;
        overflow-y: auto;
        overflow-x: hidden;
        margin: 0.2em 0;
        padding: 0.5em;
    }
}